<!DOCTYPE html>
<html>
<head>
	<title>react-生命周期</title>
    <meta charset="UTF-8" />
	<script src='../node_modules/react/umd/react.development.js'></script>
	<script src='../node_modules/react-dom/umd/react-dom.development.js'></script>
    <script src='../node_modules/babel-standalone/babel.min.js'></script>
    <script>
    /**

    React 生命周期
        componentWillMount();
        componmentDidMount();//完成挂载
        componmentWillUpdate();//组件即将更新
        componentWillUnmount();//组件即将移除
    **/
    </script>
</head>
<body>
    <div id="my"></div>
    <script type="text/babel">
    class Tab extends React.Component{
        componentWillMount(){
          console.log('组件将要挂载');
        };
        componentDidMount () {
          console.log('组件完成挂载');
        };
        componentWillUpdate()  {
          console.log('组件将要更新');
        };
        componentWillUnmount(){
          console.log('在组件从 DOM 中移除的时候立刻被调用');
        }
        
        render(){ 
            return (
                <div>
                    
                </div>
                )
        }
    };
    
     ReactDOM.render(
          <Tab/>,
        document.getElementById('my')
    )
    </script>
</body>
</html>